<template>
  <div class="handOver">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <p>{{ $t('handoverTitle') }}({{ $t('handlerId') }}:{{ formInline.eqp1Id }} {{ $t('testerId') }}:{{ formInline.eqp2Id }})</p>
      </div>
      <el-form :model="formInline" class="form-inline" label-width="120px">
        <el-row>
          <el-col :span="12">
            <el-form-item :label="$t('operator')">
              <el-input v-model="formInline.trOperId" :disabled="true"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item :label="$t('password')">
              <el-input v-model="formInline.currentPassword" type="password" auto-complete="new-password"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item :label="$t('handlerUserId')">
              <el-input v-model="formInline.handUserId"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item :label="$t('password')">
              <el-input v-model="formInline.handUserPassword" type="password"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item :label="$t('lotIdNumber')">
              <el-input
                v-model="formInline.lotId"
                :disabled="true"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item :label="$t('productName')">
              <el-input
                v-model="formInline.productName"
                :disabled="true"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item :label="$t('customerLotId')">
              <el-input
                v-model="formInline.custLotID"
                :disabled="true"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item :label="$t('customName')">
              <el-input
                v-model="formInline.custName"
                :disabled="true"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item :label="$t('workOrder')">
              <el-input
                v-model="formInline.lotId"
                :disabled="true"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item :label="$t('testorderName')">
              <el-input
                v-model="formInline.trProgram"
                :disabled="true"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <el-row :gutter="20">
        <el-col :span="4" :offset="2">
          <!-- v-if="$checkPermission($route.path+'/index/btnforce')" -->
          <el-button type="danger" icon="el-icon-s-claim" @click="forceHandover">{{ $t('forceHandover') }}</el-button>
        </el-col>
        <el-col :span="4" :offset="10">
          <el-button type="danger" icon="el-icon-s-claim" @click="batchHandOver">{{ $t('batchHandover') }}</el-button>
          <!-- v-if="$checkPermission($route.path+'/index/btnhandover')" -->
        </el-col>
        <el-col :span="4">
          <el-button type="primary" icon="el-icon-s-claim" @click="confirmHandOver">{{ $t('confirmHandover') }}</el-button>
        </el-col>
      </el-row>
    </el-card>
    <forcedHandover ref="forcedHandover"/>
  </div>
</template>
<script>
import eqpAreaApi from '@/api/production/eqpMonitor'
import handoverApi from '@/api/production/handover'
import mySetting from '@/mixins/mySetting'
import forcedHandover from './components/forcedHandover'
export default {
  name: 'HandOver',
  components: { forcedHandover },
  mixins: [mySetting],
  data() {
    return {
      formInline: {}
    }
  },
  computed: {},
  watch: {},
  created() {
    this.iniPage()
  },
  mounted() {},
  methods: {
    iniPage() {
      eqpAreaApi.getBaseInfo({ eqpId: this.$route.query.eqp1Id }).then(res => {
        this.formInline = res.data
      })
    },
    // 强制交接
    forceHandover() {
      if (this.formInline.handUserId == null || this.formInline.handUserId === '') {
        this.$notify({
          title: this.$t('tip'),
          message: this.$t('handUserIdRequired'),
          type: 'error',
          duration: 5000
        })
        return false
      }
      if (this.formInline.handUserPassword == null || this.formInline.handUserPassword === '') {
        this.$notify({
          title: this.$t('tip'),
          message: this.$t('handUserPasswordRequired'),
          type: 'error',
          duration: 5000
        })
        return false
      }
      this.$confirm(this.$t('forceHandOp'), this.$t('tip'), {
        confirmButtonText: this.$t('confirm'),
        cancelButtonText: this.$t('cancel'),
        type: 'warning'
      })
        .then(() => {
          this.doConfirm(3)
        })
        .catch(() => {})
    },
    // 批量交接
    batchHandOver() {
      this.$refs.forcedHandover.handleOpen(this.formInline.lotId)
      // if (this.formInline.currentPassword == null || this.formInline.currentPassword === '') {
      //   this.$notify({
      //     title: this.$t('tip'),
      //     message: this.$t('currentPasswordRequired'),
      //     type: 'error',
      //     duration: 5000
      //   })
      //   return false
      // }
      // if (this.formInline.handUserId == null || this.formInline.handUserId === '') {
      //   this.$notify({
      //     title: this.$t('tip'),
      //     message: this.$t('handUserIdRequired'),
      //     type: 'error',
      //     duration: 5000
      //   })
      //   return false
      // }
      // if (this.formInline.handUserPassword == null || this.formInline.handUserPassword === '') {
      //   this.$notify({
      //     title: this.$t('tip'),
      //     message: this.$t('handUserPasswordRequired'),
      //     type: 'error',
      //     duration: 5000
      //   })
      //   return false
      // }
      // this.$confirm(this.$t('batchHandOp'), this.$t('tip'), {
      //   confirmButtonText: this.$t('confirm'),
      //   cancelButtonText: this.$t('cancel'),
      //   type: 'warning'
      // })
      //   .then(() => {
      //     this.doConfirm(2)
      //   })
      //   .catch(() => {})
    },
    // 确认交接
    confirmHandOver() {
      if (this.formInline.currentPassword == null || this.formInline.currentPassword === '') {
        this.$notify({
          title: this.$t('tip'),
          message: this.$t('currentPasswordRequired'),
          type: 'error',
          duration: 5000
        })
        return false
      }
      if (this.formInline.handUserId == null || this.formInline.handUserId === '') {
        this.$notify({
          title: this.$t('tip'),
          message: this.$t('handUserIdRequired'),
          type: 'error',
          duration: 5000
        })
        return false
      }
      if (this.formInline.handUserPassword == null || this.formInline.handUserPassword === '') {
        this.$notify({
          title: this.$t('tip'),
          message: this.$t('handUserPasswordRequired'),
          type: 'error',
          duration: 5000
        })
        return false
      }
      this.$confirm(this.$t('confirmHandOp'), this.$t('tip'), {
        confirmButtonText: this.$t('confirm'),
        cancelButtonText: this.$t('cancel'),
        type: 'warning'
      })
        .then(() => {
          this.doConfirm(1)
        })
    },
    doConfirm(type) {
      this.btnLoading = true
      const obj = {
        eqp1ID: this.formInline.eqp1Id,
        eqp2ID: this.formInline.eqp2Id,
        lotId: this.formInline.lotId,
        type: type,
        currentID: this.formInline.trOperId,
        currentPassword: this.formInline.currentPassword,
        nextID: this.formInline.handUserId,
        nextPassword: this.formInline.handUserPassword
      }
      handoverApi.doHandOver(this.$clearNull(obj)).then((res) => {
        this.doMerge(res)
        if (res.code === 1) {
          this.btnDisable = true
        }
      })
    }
  }
}
</script>
<style lang='scss' scoped>
.handOver{
  padding-bottom: 40px;
}
.box-card {
  width: 94%;
  margin: 20px auto;
    p {
    font-size: 16px;
    font-weight: bold;
  }
}
::v-deep .el-card__header {
  padding: 0;
  padding-left: 15px;
}
::v-deep .el-input-group__append {
  padding: 0;
  cursor: pointer;
  .append-get {
    width: 60px;
    height: 30px;
    display: block;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
.el-row {
  margin-top: 20px;
}
</style>
